<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<title></title>
		<link rel="stylesheet" href="../css/weui.css">
		<link rel="stylesheet" href="../img-font/iconfont.css">
		<script src="../js/weui.min.js"></script>
		<script src="../js/main.js"></script>
		<style type="text/css">
			.weui-uploader__file img {
				width: 100%;
				height: 100%;
			}

			.mt0 {
				margin-top: 0;
			}

			.weui-cells:before {
				border: none;
			}

			.black {
				background-color: #373b3e;
			}

			.back {
				width: 40px;
			}

			.lh {
				line-height: 1;
			}

			.js_dialog {
				display: none;
			}

			.icon-xia {
				color: #fff;
				font-size: 16px;
			}

			.weui-cells_checkbox {
				display: flex;
				font-size: 14px;
			}

			.weui-check__label {
				border-top: 0;
			}

			.weui-mask {
				display: none;
			}

			.weui-cell:before {
				border: none;
			}

			#toast {
				display: none;
				z-index: 9999;
			}

			.loadingToast_warry {
				width: 100%;
				height: 100%;
				position: fixed;
				top: 0;
				left: 0;
				display: none;
				z-index: 9999;
			}
		</style>
	</head>

	<body>
		<div class="container">
			<div class="weui-cells mt0 black">
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<a href="javascript:history.go(-1)">
							<div class="back">
								<i class="iconfont icon-xia"></i>
							</div>
						</a>
					</div>
					<div class="weui-cell__bd"></div>
					<div class="weui-cell__ft lh">
						<a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_primary" id="submit">发送</a>
					</div>
				</div>
			</div>
			<div class="weui-cells weui-cells_form mt0">
				<div class="weui-cell">
					<div class="weui-cell__bd">
						<textarea class="weui-textarea" placeholder="请输入文本" rows="3" onkeyup="this.value=this.value.replace(/\uD83C[\uDF00-\uDFFF]|\uD83D[\uDC00-\uDE4F]/g,'')"></textarea>
						<div class="weui-textarea-counter"><span>0</span>/500</div>
					</div>
				</div>
			</div>
			<div class="weui-cells weui-cells_form mt0">
				<div class="weui-cell">
					<div class="weui-cell__bd">
						<div class="weui-uploader">

							<div class="weui-uploader__bd">
								<ul class="weui-uploader__files" id="uploaderFiles">

								</ul>
								<div class="weui-uploader__input-box">
									<input id="uploaderInput" class="weui-uploader__input file" type="file" accept="image/*">
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!--  <aside class="mask works-mask">
		<div class="mask-content">
			<p class="del-p">您确定要删除作品图片吗？</p>
			<p class="check-p"><span class="del-com wsdel-ok">确定</span><span class="wsdel-no">取消</span></p>
		</div>
	</aside> -->

			<div class="js_dialog" id="iosDialog">
				<div class="weui-mask"></div>
				<div class="weui-dialog">
					<div class="weui-dialog__hd"><strong class="weui-dialog__title">提示</strong></div>
					<div class="weui-dialog__bd">是否删除该图片?</div>
					<div class="weui-dialog__ft">
						<a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_default cancal">取消</a>
						<a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary delete">删除</a>
					</div>
				</div>
			</div>
			<div class="weui-cells weui-cells_checkbox">
				<label class="weui-cell weui-check__label" for="s11">
                <div class="weui-cell__hd">
                    <input type="radio" class="weui-check selected" name="checkbox1" id="s11" title="0" checked="">
                    <i class="weui-icon-checked"></i>
                </div>
                <div class="weui-cell__bd">
                    <p>充值广告金</p>
                </div>
            </label>
				<label class="weui-cell weui-check__label" for="s12" title="1">
                <div class="weui-cell__hd">
                    <input type="radio" name="checkbox1" class="weui-check" id="s12" title="1">
                    <i class="weui-icon-checked"></i>
                </div>
                <div class="weui-cell__bd">
                    <p>赠送广告金</p>
                </div>
            </label>
			</div>
			<div class="weui-cell weui-cell_warn">
				<div class="weui-cell__hd"><label class="weui-label" style="color: #0094ff;">点击金额</label></div>
				<div class="weui-cell__bd">
					<input class="weui-input click_amount" style="color: red;" type="text" placeholder="请输入点击金额" onkeyup="this.value=/^\d+\.?\d{0,2}$/.test(this.value) ? this.value : ''" />
				</div>
				<div class="weui-cell__ft">
				</div>
			</div>
			<div class="weui-cell weui-cell_warn">
				<div class="weui-cell__hd"><label class="weui-label" style="color: #0094ff;">上限金额</label></div>
				<div class="weui-cell__bd">
					<input class="weui-input ceiling_amount" style="color: red;" type="text" placeholder="请输入上限金额" onkeyup="this.value=/^\d+\.?\d{0,2}$/.test(this.value) ? this.value : ''" />
				</div>
				<div class="weui-cell__ft">
				</div>
			</div>
			<div id="toast">
				<div class="weui-mask_transparent"></div>
				<div class="weui-toast">
					<i class="weui-icon-success-no-circle weui-icon_toast"></i>
					<p class="weui-toast__content">已完成</p>
				</div>
			</div>
			<div class="loadingToast_warry">
				<div id="loadingToast">
					<div class="weui-mask_transparent"></div>
					<div class="weui-toast">
						<i class="weui-loading weui-icon_toast"></i>
						<p class="weui-toast__content">上传中</p>
					</div>
				</div>
			</div>
		</div>
		<div class="weui-mask">
			<div class="weui-dialog">
				<div class="weui-dialog__bd">弹窗样式</div>
				<div class="weui-dialog__ft">
					<a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary">知道了</a>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src='http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js'></script>
	<script src="../js/Url.js"></script>
	<script type="text/javascript">
		$('.weui-textarea').bind('input propertychange', function() {
			if($(this).val().length <= 500) {
				$('.weui-textarea-counter >span').html($(this).val().length)
			} else {
				//				$(this).val().length = 50;
				$('.weui-mask').show();
				$('.weui-dialog__bd').html('字数已达上限！')
			}
		})

		$(function() {
			var delParent;
			var defaults = {
				fileType: ["jpg", "png", "bmp", "gif", "jpeg", "JPG", "PNG", "BMP", "JPEG", "GIF"], //上传文件的类型
				fileSize: 1024 * 1024 * 10 // 上传文件的大小 10M
			};

			$('.file').change(function() {
				var idFile = $(this).attr("id");
				var file = document.getElementById(idFile);
				var imgContainer = $(this).parents(".weui-uploader__bd"); //存放图片的父元素
				var fileList = file.files; //获取的图片文件
				console.log(fileList + "======filelist=====");
				var input = $(this).parent(); //文本框的父元素
				// var numUp = imgContainer.find(".weui-uploader__file").length;
				var numUp = $('#uploaderFiles').find('li').length;
				$('#num').text(numUp);
				console.log(numUp);
				var totalNum = numUp + fileList.length; //总的数量
				if(fileList.length > 3 || totalNum > 3) {
					$('.weui-mask').show();
					$('.weui-dialog__bd').html('上传图片不可以超过3个，请重新选择')
				} else if(numUp < 3) {
					fileList = validateUp(fileList);
					// console.log(fileList[0]);

					var reader = new FileReader();
					reader.readAsDataURL(fileList[0]);
					reader.onload = function(e) {
						// console.log(e.target.result);
						var str = $('<li class="weui-uploader__file"><img src="' + e.target.result + '" alt=""></li>').on('click', function() {
							// alert($(this));
							$(".js_dialog").show();
							delParent = $(this);
							console.log(delParent);
						});
						$('#uploaderFiles').append(str);

					}
				}

				// numUp = imgContainer.find(".weui-uploader__file").length;
				console.log(numUp);
				if(numUp >= 2) {
					$(this).parent().hide();
				}

				// $('.click').on('click',function () {
				// 	alert('aa');
				// })

			})

			$(".delete").click(function() {

				$(".js_dialog").hide();
				var numUp = delParent.siblings().length;
				console.log(numUp);
				if(numUp < 3) {
					$(".weui-uploader__input-box").show();
				}
				delParent.remove();

			});

			$(".cancal").click(function() {
				$(".js_dialog").hide();
			});

			//			$("#submit").click(function() {
			//				var leng = $('.weui-uploader__file').length;
			//				alert(leng);
			//			})

			function validateUp(files) {
				var arrFiles = []; //替换的文件数组
				for(var i = 0, file; file = files[i]; i++) {
					//获取文件上传的后缀名
					var newStr = file.name.split("").reverse().join("");
					if(newStr.split(".")[0] != null) {
						var type = newStr.split(".")[0].split("").reverse().join("");
						console.log(type + "===type===");
						if(jQuery.inArray(type, defaults.fileType) > -1) {
							// 类型符合，可以上传
							if(file.size >= defaults.fileSize) {
								alert(file.size);
								alert('您这个"' + file.name + '"文件大小过大');
							} else {
								// 在这里需要判断当前所有文件中
								arrFiles.push(file);
							}
						} else {
							alert('您这个"' + file.name + '"上传类型不符合');
						}
					} else {
						alert('您这个"' + file.name + '"没有类型, 无法识别');
					}
				}
				return arrFiles;
			}

		})
		$('.weui-check').on('click', function() {
			$(this).addClass('selected').parents().parents().siblings().children().children().removeClass('selected');
			console.log($('.selected').attr('title') - 0)
		})

		$('.weui-dialog__btn_primary').on('click', function() {
			$('.weui-mask').hide()
		})
		//		'fileUrl': images.serverId,图片数组
		//			'status': status,广告金类型
		//			'advertMoney': advertMoney,点击金额
		//			'advertTopMoney': advertTopMoney,上限金额
		//			'advertContent': advertContent,文本内容
		//	'openId': openId
		$("#submit").on('click', function() {
			var advertContent = $('.weui-textarea').val();
			var status = $('.selected').attr('title') - 0;
			var advertMoney = $('.click_amount').val() - 0;
			var advertTopMoney = $('.ceiling_amount').val() - 0;
			var leng = $('.weui-uploader__file').length;
			var arr = [];
			for(var i = 0; i < leng; i++) {
				var str = $('.weui-uploader__file img')[i].src;
				arrImg = str.split(",").join("[douhao]");
				arr.push(arrImg);

        }
        if($('.weui-textarea').val().length == 0 || $('.weui-textarea').val().length > 500 || $('.weui-textarea').val()[0] == ' ') {
            $('.weui-mask').show();
            $('.weui-dialog__bd').html('文本字数不能为空，最多不超过500字！')
        } else if(arr.length == 0) {
            $('.weui-mask').show();
            $('.weui-dialog__bd').html('图片不能为空！')
        } else if(advertMoney > 0.6 || advertMoney[0] == 0 || advertMoney == '' || advertMoney < 0.1) {
            $('.weui-mask').show();
            $('.weui-dialog__bd').html('点击金额不能大于0.6,小于0,且不能为空！')
        } else if(advertMoney > advertTopMoney) {
            $('.weui-mask').show();
            $('.weui-dialog__bd').html('点击金额不能大于上限金额！')
        } else if(advertTopMoney == '') {
            $('.weui-mask').show();
            $('.weui-dialog__bd').html('上限金额不能为空！')
        } else {
            console.log(advertTopMoney)
            console.log(status)
            $.ajax({
                type: "post",
                url:"/foot/advert/checkAdvertMoney",
                data: {
                    'advertTopMoney': advertTopMoney,
                    'status': status,
                },
                success: function(res) {
                    console.log(res)
                    if(res.error_code == 0) {
                        $('.loadingToast_warry').show(200);
                        $.ajax({
                            type: "PUT",
                            url:"/foot/advert/setAdvertRecord",
                            data: {
                                'fileUrl': arr,
                                'status': status,
                                'advertMoney': advertMoney,
                                'advertTopMoney': advertTopMoney,
                                'advertContent': advertContent,
                            },
                            success: function(res) {
                                console.log(res)
                                if(res.error_code == 0) {
                                    $('.loadingToast_warry').hide(200);
                                    $('#toast').show(200);
                                    var setin = setInterval(function() {
                                        var today = new Date();
                                        $('#toast').hide(200, function() {
                                            window.location.href = '/income.html';
                                        });
                                        clearInterval(setin)

                                    }, 1000);
                                }
                            }
                        });
                    } else {
                        var r = confirm("余额不足！");
                        if(r == true) {
                            alert('请到充值页面进行操作！')
                        }
                    }
                }
            });
        }
    })

</script>

</html>